<!--
 * @Date: 2023-06-13 19:50:26
 * @LastEditTime: 2023-07-03 15:26:25
 * 介绍:开关组件
-->
<script lang="ts" setup>
import { filterObject } from "@/utils/tools/object";

const props = withDefaults(
  defineProps<{
    loading?: boolean;
    disabled?: boolean;
    size?: StrNumber;
    activeColor?: string;
    /**关闭时的背景色 */
    inactiveColor?: string;
    modelValue?: boolean | StrNumber;
    /**switch打开时的值 */
    activeValue?: boolean | StrNumber;
    /**是否开启异步变更，开启后需要手动控制输入值 */
    asyncChange?: boolean;
    /**圆点与外边框的距离 */
    space?: StrNumber;
  }>(),
  {
    activeValue: true,
  }
);
const emit = defineEmits<{
  (e: "change", v: boolean | StrNumber): void;
  (e: "input", v: boolean | StrNumber): void;
  (e: "update:modelValue", v: boolean | StrNumber): void;
}>();
const modelValue = computed({
  get() {
    return props.modelValue;
  },
  set(v) {
    emit("update:modelValue", v || false);
  },
});
const $props = computed(() => filterObject(props));
console.log($props.value);
</script>
<template>
  <u-switch
    v-bind="$props"
    v-model="modelValue"
    @change="(e:any)=>emit('change',e)"
    @input="(e:any)=>emit('input',e)"
  ></u-switch>
</template>
<style lang="scss" scoped></style>
